<template>
  <div>
    <div id="newData">
      <img src="../../assets/images/pic5.png" width="100%" alt="" />

      <van-row type="flex" justify="space-around">
        <van-col span="7">
          <div class="num1">
            <div class="yesterday">较上日+20</div>
            <strong>138180</strong>
            <div class="yesterday">累计确诊</div>
          </div>
        </van-col>
        <van-col span="7">
          <div class="num2">
            <div class="yesterday">较上日+223</div>
            <strong>125702</strong>
            <div class="yesterday">累计治愈</div>
          </div>
        </van-col>
        <van-col span="7">
          <div class="num3">
            <div class="yesterday">较上日+0</div>
            <strong>5700</strong>
            <div class="yesterday">累计死亡</div>
          </div>
        </van-col>
      </van-row>
      <van-row type="flex" justify="space-around">
        <van-col span="7">
          <div class="num4">
            <div class="yesterday">较上日+13</div>
            <strong>6778</strong>
            <div class="yesterday">现有确诊</div>
          </div>
        </van-col>
        <van-col span="7">
          <div class="num5">
            <div class="yesterday">今日新增待公布</div>
            <strong>1</strong>
            <div class="yesterday">现有疑似</div>
          </div>
        </van-col>
        <van-col span="7">
          <div class="num6">
            <div class="yesterday">较上日-1</div>
            <strong>8</strong>
            <div class="yesterday">现有重症</div>
          </div>
        </van-col>
      </van-row>
    </div>
    <div id="reading">
        <h1>24小时必须</h1>
        <div id="contain">
            <div class="contain-box">
                <img src="../../assets/images/pic6.png" alt="">
                <div class="box1">
                    <span>省高院落马女副院长出镜痛哭：“宁可在外面做叫花子也比现在幸福”</span>
                </div>
            </div>
            <div class="contain-box">
                <img src="../../assets/images/pic7.png" alt="">
                <div class="box1">
                    <span>北京冬奥会操纵运动员核酸结果、影响来华参赛？官方回应：决不会做</span>
                </div>
            </div>
            <div class="contain-box">
                <img src="../../assets/images/pic8.png" alt="">
                <div class="box1">
                    <span>美国海军证实：网传F-35C南海“入水”图为真</span>
                </div>
            </div>
            <div class="contain-box">
                <img src="../../assets/images/pic9.png" alt="">
                <div class="box1">
                    <span>棱镜｜春节前夕的三亚：有海鲜大排档关门，高端酒店除夕涨到6000</span>
                </div>
            </div>
            <div class="contain-box">
                <img src="../../assets/images/pic10.png" alt="">
                <div class="box1">
                    <span>外卖小哥的西安年事：看见街上重新开始堵车，激动得想哭</span>
                </div>
            </div>
        </div>
    </div>
  </div>
</template>

<script>
export default {};
</script>

<style scoped>
#newData{
    background-color: rgb(248, 248, 248);
}
#newData img {
  margin-top: 0.2rem;
}
.num1 {
  font-size: 0.32rem;

  line-height: 0.5rem;
  text-align: center;
  height: 1.5rem;
  background-color: rgb(253, 215, 222);
  flex-flow: wrap;
}
.yesterday {
  font-size: 0.2rem;
}
.van-row{
    margin-top: 0.1rem;
}
.num2 {
  font-size: 0.32rem;

  line-height: 0.5rem;
  text-align: center;
  height: 1.5rem;
  background-color: rgb(216, 238, 219);
  flex-flow: wrap;
}
.num3 {
  font-size: 0.32rem;

  line-height: 0.5rem;
  text-align: center;
  height: 1.5rem;
  background-color: rgb(235, 232, 232);
  flex-flow: wrap;
}
.num4 {
  font-size: 0.32rem;

  line-height: 0.5rem;
  text-align: center;
  height: 1.5rem;
  background-color: rgb(250, 239, 241);
  flex-flow: wrap;
}
.num5 {
  font-size: 0.32rem;

  line-height: 0.5rem;
  text-align: center;
  height: 1.5rem;
  background-color: rgb(240, 243, 227);
  flex-flow: wrap;
}
.num6 {
  font-size: 0.32rem;

  line-height: 0.5rem;
  text-align: center;
  height: 1.5rem;
  background-color: rgb(236, 244, 247);
  flex-flow: wrap;
}
#reading{
    margin-top: 0.2rem;
    width: 100%;
    height: 100%;
}
#reading h1{
    margin-left: 0.2rem;
}
#contain{
    margin: 0 auto;
    height:100%;
    width: 90%;
    background-color: rgb(243, 241, 241);
}
.contain-box{
     margin: 0 auto;
    height: 2rem;
    width: 80%;
}
.box1{
    margin-top: 0.2rem;
    width: 3rem;
    font-size: 0.3rem;
    margin-left: 0.3rem;
    display: inline-block;
}
</style>